$(function () {
    //首先创建wms的数据源
    var wmsSource = new ol.source.ImageWMS({
        url: 'http://demo.opengeo.org/geoserver/wms',
        params: {'LAYERS': 'ne:ne'},
        serverType: 'geoserver'
    });
    //其次创建image图层
    var wmsLayer = new ol.layer.Image({
        source: wmsSource
    });
    /** 初始化地图 */
    //设置视图, 中心点（0, 0）,缩放级别1
    var view = new ol.View({
        center: [0, 0],
        zoom: 1
    });
    //初始化地图， 将初始化的wmsLayer和view赋值给新建的地图
    var map = new ol.Map({
        layers: [wmsLayer],
        target: 'map',
        view: view
    });
    //注册地图的单击事件，在单击后获取地图的地理坐标，通过wmsSource.getFeatureInfoUrl()方法获取符合ogc标准的url
    map.on('singleclick', function (evt) {
        document.getElementById('info').innerHTML = '';
        var viewResolution = view.getResolution();
        var url = wmsSource.getGetFeatureInfoUrl(
            evt.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}
        );
        if (url) {
            document.getElementById('info').innerHTML =
                "<iframe seamless src='" + url + "'></iframe>";
        }
    });
});